<template>
	<view>
		<!-- 		<view @tap="exit" style="margin: 80rpx 50rpx 50rpx;">
			<image style="width: 50rpx; height: 50rpx;" src="../../static/icon/exit.png"></image>
		</view> -->
		<view style="font-size: 40rpx; color: #707070; margin: 150rpx auto; width: 100%; text-align: center;">
			滁州市监管平台
		</view>
		<view v-if="flag">
			<my-input placeholder="账号" @input="inputName" icon="icon-yonghu"></my-input>
			<view style="height: 50rpx;"></view>
			<my-input placeholder="密码" @input="inputPass" :password="true" icon="icon-suo"></my-input>
			
				<view @tap="toRegister" style="color: #2FAAFE; width: 88%; margin-top: 20rpx; text-align: right; font-size: 25rpx;">
					忘记密码
				</view>
			
		</view>
		<view v-else>
			<my-input placeholder="账号" @input="inputName" icon="icon-yonghu"></my-input>
			<view style="height: 50rpx;"></view>
			<my-input placeholder="手机号" @input="inputPhone" type="number" icon="icon-shouji1"></my-input>
			<view style="height: 50rpx;"></view>
			<view style="display: flex; width: 100%;">
				<my-input placeholder="验证码" :width="'40'" align='left' @input="inputCode" :password="true" icon="icon-yanzhengma1"></my-input>

				<view v-if="!isGetCode" class="code-butt" @tap="getCode()">获取验证码</view>
				<view v-else class="code-butt" style="">{{timeOut}}秒后重新获取</view>
			</view>
		</view>
		<!-- <view @tap="changeFlag" style="text-align: right; width: 78%; color: #2FAAFE;  margin-top: 15rpx;">{{flagTip}}</view> -->
		<view @tap="login" class="button">
			<icon style="line-height: 130rpx; font-size: 40rpx; transform: rotate(-45deg); color: #FFFFFF; font-weight: 1000;"
			 class="icon-jiantou iconfont"></icon>
		</view>
		<!-- <view @tap="toIndex" style="width: 100%; text-align: center; color: #666666;">暂不登录</view> -->

		<!-- 		<view style="position: fixed; bottom: 70rpx; display: flex; text-align: center; width: 100%;">
			<view @tap="toIndex" style="width: 50%; font-size: 30rpx;">
				暂不登录
			</view>
			<text style="font-size: 30rpx; color: #D4D5D9;">|</text>
			<view @tap="toRegister" style="width: 50%; font-size: 30rpx;">
				用户注册
			</view>
		</view> -->

	</view>
</template>

<script>
	import myInput from "@/components/ui/myInput.vue"
	import {
		Decrypt,
		Encrypt
	} from '../../static/util/crypto.js'
	export default {
		components: {
			myInput,
		},
		data() {
			return {
				intervalId: '',
				uuid: '',
				isGetCode: false,
				code: '',
				username: '',
				password: '',
				phone: '',
				timeOut: 60,
				flag: true,
				flagTip: '手机验证码登录'
			}
		},
		onUnload() {
			console.log('onHide')
			if (this.intervalId != '') {
				clearInterval(this.intervalId);
			}
		},
		methods: {
			exit() {
				uni.navigateBack({

				})
			},
			toRegister() {
				uni.navigateTo({
					url: './register'
				})
			},
			changeFlag() {
				var that = this
				uni.showToast({
					icon: 'loading',
					duration: 700
				});

				setTimeout(() => {
					that.flag = !that.flag
					that.flagTip = that.flag ? '手机验证码登录' : '账号密码登录'
				}, 700)


			},
			toIndex() {
				uni.reLaunch({
					url: '../index/index'
				})
			},
			async getCode() {
				console.log(this.phone)
				var that = this;
				var res = await this.$api.getCode({
					'phone': that.phone
				})

				console.log(res.data)
				this.uuid = res.data.uuId

				this.isGetCode = true

				this.timeOut = 120; //倒计时多少秒

				var intervalId = setInterval(() => {
					console.log(intervalId)
					that.timeOut--;
					if (that.timeOut <= 0) {
						clearInterval(intervalId);
						that.intervalId = ''
						that.isGetCode = false
					}
				}, 1000)

				this.intervalId = intervalId

				console.log(res)
			},
			toChangePass() {
				uni.navigateTo({
					url: './changePass'
				})
			},
			inputCode(e) {
				this.code = e
			},
			inputPhone(e) {
				this.phone = e
			},
			inputName(e) {
				this.username = e
			},
			inputPass(e) {
				this.password = e
			},
			async login() {
				
				uni.reLaunch({
					url: '../index/index'
				})
				
				// var flag = true
				// var res = ''
				// var code = ''
				// var that = this
				// if (this.flag) {
				// 	if (that.username != '' && that.password != '') {
				// 		flag = true
				// 		// var test = {
				// 		// 	"name": Encrypt(that.username) ,
				// 		// 	"pwd": Encrypt(that.password),
				// 		// 	"code": "",
				// 		// 	"uuId": "",
				// 		// 	"flag": Encrypt(false)
				// 		// }

				// 		var test = {
				// 			"name": that.username,
				// 			"pwd": that.password,
				// 			"code": "",
				// 			"uuId": "",
				// 			"flag": false
				// 		}

<<<<<<< HEAD
				// 		res = await that.$api.Login(test)
				// 		//console.log(res)
				// 		code = res.data.code || res.data.status
				// 		res = res.data.result
				// 		// res = JSON.parse(Decrypt(res.data.result))
				// 	} else {
				// 		flag = false
				// 		uni.showModal({
				// 			title: '提示',
				// 			content: '用户名或密码不能为空',
				// 			success: function(res) {
				// 				// uni.reLaunch({
				// 				// 	url:'../index/index'
				// 				// })
				// 			}
				// 		});
				// 	}

				// } else {
				// 	// //console.log(this.code)
				// 	// var data = {
				// 	// 	'phone':this.phone,
				// 	// 	'code':this.code,
				// 	// 	'flag':true
				// 	// }
				// 	var data = {
				// 		"name": that.username,
				// 		"pwd": "",
				// 		"code": this.code,
				// 		"uuId": this.uuid,
				// 		"flag": true,
				// 		"phone": this.phone
				// 	}
				// 	//console.log(data)
				// 	res = await this.$api.Login(data)
				// 	code = res.data.code
				// 	res = res.data.result
=======
						res = await that.$api.Login(test)
						console.log(res)
						code = res.data.code || res.data.status
						res = res.data.result
						// res = JSON.parse(Decrypt(res.data.result))
					} else {
						flag = false
						uni.showModal({
							title: '提示',
							content: '用户名或密码不能为空',
							success: function(res) {
								// uni.reLaunch({
								// 	url:'../index/index'
								// })
							}
						});
					}

				} else {
					// console.log(this.code)
					// var data = {
					// 	'phone':this.phone,
					// 	'code':this.code,
					// 	'flag':true
					// }
					var data = {
						"name": that.username,
						"pwd": "",
						"code": this.code,
						"uuId": this.uuid,
						"flag": true,
						"phone": this.phone
					}
					console.log(data)
					res = await this.$api.Login(data)
					code = res.data.code
					res = res.data.result
>>>>>>> parent of 9c00801 (2.0 老人，管理员，新的ui)

				// }

<<<<<<< HEAD
				// if (code == 200) {
				// 	uni.setStorageSync('token', res.token)
				// 	//console.log(res.token)
				// 	uni.setStorageSync('nickName', res.info.user.nickName)
				// 	uni.setStorageSync('info', res.info)
				// 	uni.setStorageSync('roles', res.info.roles)
				// 	//console.log(res)
				// 	uni.setStorageSync('phone', res.info.user.phone)

				// 	uni.showModal({
				// 		title: '提示',
				// 		content: '登陆成功',
				// 		success: function(res) {
				// 			that.$store.dispatch('test',{});
				// 			uni.reLaunch({
				// 				url: '../index/index'
				// 			})
				// 		}
				// 	});
				// } else {
				// 	// //console.log(res.data)
				// 	if (flag) {
				// 		if (code == 400) {
				// 			uni.showModal({
				// 				title: '提示',
				// 				content: '账号或密码错误！',
				// 				success: function(res) {
				// 					// uni.reLaunch({
				// 					// 	url:'../index/index'
				// 					// })
				// 				}
				// 			});
				// 		} else {
				// 			//console.log(code)
				// 		}
				// 	} else {
				// 		// uni.reLaunch({
				// 		// 	url:'../index/index'
				// 		// })
				// 	}
				// }
=======
				if (code == 200) {
					uni.setStorageSync('token', res.token)
					console.log(res.token)
					uni.setStorageSync('nickName', res.info.user.nickName)
					uni.setStorageSync('info', res.info)
					uni.setStorageSync('roles', res.info.roles)
					console.log(res)
					uni.setStorageSync('phone', res.info.user.phone)

					uni.showModal({
						title: '提示',
						content: '登陆成功',
						success: function(res) {
							uni.reLaunch({
								url: '../index/index'
							})
						}
					});
				} else {
					// console.log(res.data)
					if (flag) {
						if (code == 400) {
							uni.showModal({
								title: '提示',
								content: '账号或密码错误！',
								success: function(res) {
									// uni.reLaunch({
									// 	url:'../index/index'
									// })
								}
							});
						} else {
							console.log(code)
						}
					} else {
						// uni.reLaunch({
						// 	url:'../index/index'
						// })
					}
				}
>>>>>>> parent of 9c00801 (2.0 老人，管理员，新的ui)





			},
		}
	}
</script>

<style>
	.code-butt {
		text-shadow: 5rpx 5rpx 5rpx #03C8FC;
		color: #FFFFFF;
		box-shadow: #808080 1px 1px 5px;
		width: 200rpx;
		font-weight: 800;
		text-align: center;
		font-size: 25rpx;
		line-height: 90rpx;
		margin-right: 155rpx;
		margin-left: auto;
		border-radius: 15rpx;
		height: 90rpx;
		background: #03C8FC;
	}

	.button {
		background: linear-gradient(to right, #36A5FF, #02C9FC, #36A5FF);
		transform: rotate(45deg);
		animation: bgcChange 3s;
		animation-iteration-count: infinite;
		text-align: center;
		width: 130rpx;
		height: 130rpx;
		border-radius: 50%;
		margin: 140rpx auto 40rpx;
	}

	@keyframes bgcChange {
		0% {}

		100% {
			background-position: 130rpx 0;
		}
	}
</style>
